Instructions for adding an iPhone or iPod compatible version of your Custom Web page in WeatherCat.

Todd Atkins created an iPhone/iPod template for use with the Custom Web on Lightsofts LWC, the previous iteration of Trixologys WeatherCat. I have slightly modified this template, and converted it for WeatherCat.

The previous version had the webcam image in the All Time tab. Ive added a new tab for the webcam. There is also a version without the web cam implementation.

Edouard has revised the required script to better automatically detect an iPhone or iPod. This does not work with Android or Windows iPhones

Use ipwx.html if you are not using a webcam on your web site through WeatherCat, and ipwx_Cam.html if you are.

To see what the mobile web site will look like, see the three sample images in the Documentation folder.

Installation:
 - Upload the entire ipwx folder onto your web server.

 - Place the ipwx.html or ipwx_Cam.html in your WeatherCat Custom Web folder (The folder that Set HTML Source is pointing at in the Custom Web preferences.)

 - Open the index.html file in your WeatherCat Custom Web folder with a web editor or text editor. (Save a copy before editing, just in case!) Scroll down through the file until you see </head>. Immediately above the </head> tag, paste one of the following, using either the webcam version or not:


<!-- Begin Mobile Version Script -->
<script type="text/javascript">
(function(){var c=navigator.userAgent,a=window.location,d=document.cookie,b=a.href;
if(c.match(/iP(od|hone)/i)||c.match(/Android/i))if(d.indexOf("iphone_redirect=false")<0)a.href="ipwx.html";
})();
</script>
<!-- End Mobile Version Script -->

OR

<!-- Begin Mobile Version with Webcam Script -->
<script type="text/javascript">
(function(){var c=navigator.userAgent,a=window.location,d=document.cookie,b=a.href;
if(c.match(/iP(od|hone)/i)||c.match(/Android/i))if(d.indexOf("iphone_redirect=false")<0)a.href="ipwx_Cam.html";
})();
</script>
<!-- End Mobile Version with Webcam Script -->


Save the index.html file, and youre done. If you point your iPhone or iPod at your web page, it should display the Mobile version.

Now, heres the good part. Todd has built in a feature that allows you to save this template as an app on your iPod or iPhone. Once youve uploaded the files onto your web server, added the template, and made the changes to your index file, point your iPod or iPhone at your own web page. It should open as the mobile version, as shown in the attached sample images.

Once you have your mobile web page showing on your iPod or iPhone, click on the arrow in a box icon at the bottom of the browser, and select Add to Home Screen. This will add an app for your web page on your home screen. Next time you want to see what the weather is at your station, just click on the cloud icon to take you there.

Hopefully these instructions work to get your mobile web page up and running. If you have any problems, just ask on the WeatherCat forum.

Steve